<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>
	<body>
		<!-- 主体 -->
		<main>
			<!-- 用户名 -->
			<section id="username">
				<img src="#" alt="" width="100" height="100" id="avator" />
				<h2 id="username1"></h2>
				<p>个性签名: <span id="sign"></span></p>
			</section>
			<!-- 运动数据 -->
			<section id="sports" class="rel">
				<span class="iconfont icon-shujucanmou"></span>
				<p id="data">运动数据</p>
				<span class="iconfont icon-jiantou14" id="jiantou"></span>
				<div id="sports1">
					<div id="all">
						<a href="#">总运动</a>
						<h2>
							<i>999999</i>
							<span>分钟</span>
						</h2>
					</div>
					<div id="consume">
						<a href="#">本周消耗</a>
						<h2>
							<i>999999</i>
							<span>千卡</span>
						</h2>
					</div>
				</div>
			</section>
			<!-- 运动徽章 -->
			<section id="badge" class="rel">
				<span class="iconfont icon-sharpicons_badge-"></span>
				<p id="badge1">我的运动徽章</p>
				<span class="iconfont icon-jiantou14" id="jiantou2"></span>

				<div id="badge2">
					<p><img src="../../assets/images/mybadge01.jpg" alt="" /></p>
					<p><img src="../../assets/images/mybadge02.jpg" alt="" /></p>
					<p><img src="../../assets/images/mybadge03.jpg" alt="" /></p>
				</div>
			</section>
			<!-- 退出登录 -->
			<section id="out">
				<p>退出登录</p>
			</section>
		</main>
		<!-- 底部导航栏 -->
		<nav id="tabBar"></nav>
	</body>
</html>
